<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>

<fmt:setLocale value="${config.locale.language}"/>
<fmt:setBundle basename="vn.ugame.bundle.Language" var="languageBundle"/>

<div id="header" class="default-panel">
    <div id="header-top" class="default-panel">
        <div id="logo"></div>
        <!-- End #logo -->

        <div id="action-panel">
            <a href="#" id="settingButton" onclick="return false">
                <img src="/images/setting.png" alt=""/>
            </a>
            <c:if test="${sessionScope.AuthPrincipal == null}">
                <a href="#" id="accountButton" onclick="return false">
                    <img src="/images/account.png" alt=""/>
                </a>
            </c:if>
            <c:if test="${sessionScope.AuthPrincipal != null}">
                <a href="/profile.jsp">
                    <img src="/images/account.png" alt=""/>
                </a>
            </c:if>
            <a id="searchButton" href="#" onclick="return false">
                <img src="/images/search.png" alt=""/>
            </a>
        </div>
        <!-- End #action-panel -->
    </div>
    <!-- End #header-top -->

    <div class="fd-panel">
        <div id="search-panel">
            <table width="100%" cellpadding="0" cellspacing="0">
                <tr>
                    <td valign="top">
                        <div class="left-fd-panel default-panel">
                        </div>
                        <!-- End .left-fd-panel -->
                    </td>
                    <td style="width: 224px;" valign="top">
                        <div class="center-fd-panel default-panel">
                            <div class="main-fd-panel">
                                <div class="text-input-wrapper">
                                    <input type="text" 
                                           id="search-content"
                                           class="placeholder-effect input text-input"
                                           placeholder="<fmt:message 
                                               key="ugame.search" 
                                               bundle="${languageBundle}"/>"/>
                                    <a href="#" id="submit-search" onclick="return false"></a>
                                </div>
                            </div>
                            <!-- End .main-fd-panel -->
                            <div class="bottom-fd-panel">
                            </div>
                            <!-- End .bottom-fd-panel -->
                        </div>
                        <!-- End .center-fd-panel -->
                    </td>
                    <td valign="top">
                        <div class="right-fd-panel default-panel">
                        </div>
                        <!-- End .right-fd-panel -->
                    </td>
                </tr>
            </table>
        </div>
        <!-- End #search-panel -->

        <div id="login-panel">
            <form id="login-form" action="<c:out value="/${loginModule.name}"/>">
                <table width="100%" cellpadding="0" cellspacing="0">
                    <tr>
                        <td valign="top">
                            <div class="left-fd-panel default-panel">
                                <a class="sign-up" href="<c:url value="/${registerModule.name}"/>"></a>
                            </div>
                            <!-- End #left -->
                        </td>
                        <td valign="top" style="width: 224px;">
                            <div class="center-fd-panel default-panel">
                                <div class="main-fd-panel">
                                    <div class="text-input-wrapper">
                                        <input type="text" id="txt-email" 
                                               name="txt-email"
                                               class="placeholder-effect input text-input"
                                               placeholder="<fmt:message key="ugame.email" bundle="${languageBundle}"/>"/>
                                        <input type="password" id="txt-password" 
                                               name="txt-password"
                                               class="placeholder-effect input text-input text-input-last"
                                               placeholder="<fmt:message key="ugame.password" bundle="${languageBundle}"/>"/>
                                    </div>
                                </div>
                                <!-- End .main-fd-panel -->
                                <div class="bottom-fd-panel">
                                </div>
                                <!-- End .bottom-fd-panel -->
                            </div>
                            <!-- End .center-fd-panel -->
                        </td>
                        <td valign="top">
                            <div class="right-fd-panel default-panel">
                                <a class="sign-in" href="#"></a>
                            </div>
                            <!-- End #right -->
                        </td>
                    </tr>
                </table>
            </form>
        </div>
        <!-- End #login-panel -->

        <div id="language-panel">
            <table width="100%" cellpadding="0" cellspacing="0">
                <tr>
                    <td valign="top">
                        <div class="left-fd-panel default-panel">
                        </div>
                        <!-- End .left-fd-panel -->
                    </td>
                    <td valign="top" style="width: 224px;">
                        <div class="center-fd-panel default-panel">
                            <div class="main-fd-panel">
                                <c:forEach var="language" items="${languages}">
                                    <div class="check-input-1">
                                        <c:choose>
                                            <c:when test="${language.current == true}">
                                                <input type="radio" 
                                                       value="<c:out value="${language.locale.language}"/>" 
                                                       id="<c:out value="${language.locale.language}"/>" 
                                                       name="language"
                                                       checked="true"
                                                       alt="<c:out value="${language.url}"/>"/>
                                            </c:when>
                                            <c:otherwise>
                                                <input type="radio" 
                                                       value="<c:out value="${language.locale.language}"/>" 
                                                       id="<c:out value="${language.locale.language}"/>" 
                                                       name="language"
                                                       alt="<c:out value="${language.url}"/>"/>
                                            </c:otherwise>
                                        </c:choose>
                                        <label for="<c:out value="${language.locale.language}"/>">
                                            <fmt:message key="ugame.language.${language.locale.language}" 
                                                         bundle="${languageBundle}"/>
                                        </label>
                                    </div>
                                </c:forEach>
                            </div>
                            <!-- End .main-fd-panel -->
                            <div class="bottom-fd-panel">
                            </div>
                            <!-- End .bottom-fd-panel -->
                        </div>
                        <!-- End .center-fd-panel -->
                    </td>
                    <td valign="top">
                        <div class="right-fd-panel default-panel">
                        </div>
                        <!-- End .right-fd-panel -->
                    </td>
                </tr>
            </table>
        </div>
        <!-- End #language-panel -->
    </div>
    <!-- End #fd-panel-->

    <div id="banner" class="default-panel">
        <img src="/images/banner.png" alt="">
        <c:if test="${sessionScope.AuthPrincipal == null}">
            <a href="/login/openid/Google?returnURL=<c:out value="${requestURI}"/>" style="position:absolute; right: 10px; top: 3px; width: 32px; height: 32px; background: url('/images/google-icon-32.png') no-repeat center">            
            </a>
            <a href="/login/openid/Yahoo?returnURL=<c:out value="${requestURI}"/>" style="position:absolute; right: 10px; top: 43px; width: 32px; height: 32px; background: url('/images/yahoo-icon-32.png') no-repeat center">            
            </a>
        </c:if>
    </div>

    <!-- End #banner -->
    <div id="main-nav" class="default-panel touch">
        <table cellpadding="0" cellspacing="0">
            <tr>
                <c:forEach var="root" items="${roots}">
                    <td class="<c:out value="${(config.type == 1 || config.type == 2 || config.type == 3) && (root.type == 1) ? 'active' : ''}"/>">
                        <a href="/<c:url value="${root.name}" />" class="text-effect-2">
                            <c:out value="${root.text}"/>
                        </a>
                    </td>
                </c:forEach>
            </tr>
        </table>
    </div><!-- End #main-nav -->
</div>
<!-- End #header -->